<div class="boxed">
    <div id="content-container">
        <div id="page-title">
            <h1 class="page-header text-overflow">Data Tables</h1>
            <div class="searchbox">
                <div class="input-group custom-search-form">
                    <input type="text" class="form-control" placeholder="Search..">
                    <span class="input-group-btn">
                        <button class="text-muted" type="button"><i class="demo-pli-magnifi-glass"></i></button>
                    </span>
                </div>
            </div>
        </div>
        <ol class="breadcrumb">
            <li><a href="{:url('Admin/Index/index')}">首页</a></li>
            <li>权限控制</li>
            <li class="active">权限管理</li>
        </ol>
        <div id="page-content">
            <div class="panel">
                <div class="panel-heading">
                    <h3 class="panel-title">
                        <button class="btn btn-info" onclick="rule.add()">添加菜单</button>
                    </h3>
                </div>
                <div class="panel-body">
                    <table id="demo-dt-basic" class="table table-striped table-bordered" cellspacing="0" width="100%">
                        <thead>
                        <tr>
                            <th width="250">权限名</th>
                            <th>权限</th>
                            <th>状态</th>
                            <th>图标</th>
                            <th>类型</th>
                            <th width="220">描述</th>
                            <th class="min-tablet">操作</th>
                        </tr>
                        </thead>
                        <tbody>
                        {foreach name="data" id="v"}
                        <tr>
                            <td>{$v['_name']}</td>
                            <td>{$v['name']}</td>
                            <td>
                                {eq name="$v.status" value="1"}
                                <button class="btn btn-xs btn-success">显示</button>
                                {else/}
                                <button class="btn btn-xs btn-default">隐藏</button>
                                {/eq}
                            </td>
                            <td align="center">
                                <i class="{$v['icon']}">
                                </i>
                            </td>
                            <td>
                                {switch name="$v.func" }
                                    {case value="1"}模块{/case}
                                    {case value="2"}方法{/case}
                                    {case value="2"}链接{/case}
                                    {case value="2"}空操作{/case}
                                    {default /}默认
                                {/switch}
                            </td>
                            <td>{$v['description']}</td>
                            <td>
                                <button class="btn btn-xs btn-info">
                                    <span href="javascript:;"
                                       ruleId="{$v['id']}"
                                       ruleName="{$v['name']}"
                                       ruleTitle="{$v['title']}"
                                       onclick='rule.edit({:Mkjson($v)})'>修改</span>
                                </button>
                                <button class="btn btn-xs btn-danger">
                                    <span href="{:url('Admin/Rule/delete',array('id'=>$v['id']))}" onclick="rule.del($(this))">
                                        删除
                                    </span>
                                </button>
                            </td>
                        </tr>
                        {/foreach}
                        </tbody>
                    </table>
                </div>
            </div>
        </div>
    </div>
</div>
<template id="thinkright-add">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">
                    &times;
                </button>
                <h4 class="modal-title" id="myModalLabel">
                    新增菜单
                </h4>
            </div>
            <div class="modal-body">
                <form id="ruleAdd" class="form-horizontal" act="{:url('Admin/Rule/add')}">
                    <div class="panel-body">
                        <div class="form-group">
                            <label class="col-sm-2 control-label" for="demo-hor-inputemail">名称</label>
                            <div class="col-sm-9">
                                <input placeholder="请输入节点名称" type="text"
                                       id="demo-hor-inputemail" class="form-control" name="title" required="required">
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-sm-2 control-label" for="demo-hor-inputemail">父级菜单</label>
                            <div class="col-sm-9">
                                <select id="demo-select2" class="demo_select2 form-control" name="pid">
                                    <option value="0">顶级菜单</option>
                                    {foreach name="data" id="v"}
                                        <option class="pid_{$v.id}" value="{$v.id}">{$v['_name']}</option>
                                    {/foreach}
                                </select>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-sm-2 control-label" for="demo-hor-inputpass">权限</label>
                            <div class="col-sm-9">
                                <input placeholder="Admin/Rule/index" type="text"
                                       id="demo-hor-inputpass" class="form-control" name="name" required="required">
                                <span class="text-warning">输入模块/控制器/方法即可 例如 Admin/Rule/index</span>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-md-2 control-label">状态</label>
                            <div class="col-md-9">
                                <div class="radio">
                                    <input id="demo-form-radio" class="magic-radio status1" type="radio" name="status" checked="" value="1">
                                    <label for="demo-form-radio">显示</label>
                                    <input id="demo-form-radio-2" class="magic-radio status2" type="radio" name="status" value="0">
                                    <label for="demo-form-radio-2">隐藏</label>
                                </div>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-sm-2 control-label" for="demo-hor-inputemail">图标</label>
                            <div class="col-sm-9">
                                <div class="input-group mar-btm">
                                    <input type="text" placeholder="请输入图标代码" class="form-control" name="icon">
                                    <div class="input-group-btn">
                                        <a target="_blank" href="{:url('Admin/Units/icon')}">
                                            <button type="button" style="padding:4px 12px;" class="btn btn-primary dropdown-toggle">
                                                查找
                                                <i class="ion-search"></i>
                                            </button>
                                        </a>
                                    </div>
                                </div>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-sm-2 control-label" for="demo-hor-inputemail">排序</label>
                            <div class="col-sm-9">
                                <input type="number" class="form-control" name="order" placeholder="排序" data-bv-field="range">
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-md-2 control-label">类型</label>
                            <div class="col-md-9">
                                <div class="radio">
                                    <!-- Inline radio buttons -->
                                    <input id="demo-inline-form-radio" class="magic-radio func1" type="radio" name="func" value="1" checked="">
                                    <label for="demo-inline-form-radio">模块</label>
                                    <input id="demo-inline-form-radio-2" class="magic-radio func2" type="radio" name="func" value="2">
                                    <label for="demo-inline-form-radio-2">方法</label>
                                    <input id="demo-inline-form-radio-3" class="magic-radio func3" type="radio" name="func" value="3">
                                    <label for="demo-inline-form-radio-3">链接</label>
                                    <input id="demo-inline-form-radio-4" class="magic-radio func4" type="radio" name="func" value="4">
                                    <label for="demo-inline-form-radio-4">空操作</label>
                                </div>
                            </div>
                        </div>
                        <div class="form-group">
                            <label class="col-md-2 control-label" for="demo-textarea-input">介绍</label>
                            <div class="col-md-9">
                                <textarea name="description" id="demo-textarea-input" rows="5"
                                          class="form-control" placeholder="Your content here.."></textarea>
                            </div>
                        </div>
                    </div>
                    <input type="hidden" name="editor">
                    <div class="panel-footer text-right">
                        <div class="btn btn-info submitDoc" onclick="rule.submit()">提交表单</div>
                        <div class="btn" type="button" onclick="layer.closeAll()">取消</div>
                    </div>
                </form>
            </div>
        </div>
    </div>
</template>
<!-- 修改菜单模态框结束 -->
<script type="text/javascript">
    var rule = {
        add:function () {
            this.open('#thinkright-add');
        },
        edit:function (obj) {
            setTimeout(function () {
                $("input[name='id']").val(obj.id);
                $("input[name='title']").val(obj.title);
                $("input[name='name']").val(obj.name);
                $("input[name='description']").val(obj.description);
                $("input[name='editor']").val(obj.id);
                $("input[name='icon']").val(obj.icon);
                $('.status'+obj.status).attr('checked',true).siblings('input').remove('checked');
                $('.func'+obj.func).attr('checked',true).siblings('input').remove('checked');
                $('.pid_'+obj.pid).attr('selected','selected').siblings('option').remove('selected');
                $('.submitDoc').text('编辑表单');
                $('#myModalLabel').text('编辑菜单')
            },500);
            this.open('#thinkright-add');
        },
        open:function (name) {
            layer.open({
                type: 1,
                shade: 0.6,
                title: false, //不显示标题
                area: ['600px', '680px'], //宽高
                scrollbar: false,
                content:$(name).html(),
                cancel: function(){}
            });
        },
        child:function (obj) {
            var ruleId=$(obj).attr('ruleId');
            $("input[name='pid']").val(ruleId);
            this.add();
        },
        submit:function () {
            form.ajax('#ruleAdd',function (res) {
                layer.msg(res.msg,function () {
                    if(res.code > 0){
                        layer.closeAll();
                        location.reload();
                    }
                })
            })
        },
        del:function (obj) {
            layer.confirm('你确定要删除吗?', {
                btn: ['删除','取消'] //按钮
            }, function(){
                $.post(obj.attr('href'), function(data) {
                    layer.msg(data.msg, {icon: 1},function () {
                        if(data.code > 0){
                            layer.closeAll();
                            location.reload();
                        }
                    });
                });
            }, function(){
            });
        }
    };
</script>